.form-textarea {
  border: 1px solid $palette-neutral-400;
  position: relative;
  width: 100%;
  padding: 12px 16px;
  line-height: 22px;

  @include elevation($elevation-low);
  @include rounded($rounded-md);

  &:active,
  &:focus,
  &:focus-within {
    &:not(.form-textarea--disabled):not(.form-textarea--error) {
      border-color: $palette-blue-500;
    }
  }

  &.form-textarea--error {
    border-color: $palette-red-600;
  }

  &--small {
    padding: 8px 12px;
  }
}

.form-textarea--disabled {
  cursor: not-allowed;
  background-color: $palette-neutral-100;
  color: $palette-neutral-700;
  box-shadow: none;
}

.form-textarea--auto-expendable {
  resize: none;
}
